<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>传送存档</title>
    <link rel="stylesheet" type="text/css" href="baye.css" />
    <link rel="icon" href="favicon.png">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
    <style>
        .btn.menu {
            margin-bottom: 2px;
        }
        #url {
            font-size: 30px;
        }
    </style>
    <script src="js/jquery.min.js"></script>
    <script src="js/lzma_worker-min.js"></script>
    <script src="js/base64.js"></script>
    <script src="js/lcd.js?ver=11"></script>
    <script src="js/spin.min.js"></script>
    <script>
        var opts = {
              lines: 13 // The number of lines to draw
            , length: 28 // The length of each line
            , width: 14 // The line thickness
            , radius: 42 // The radius of the inner circle
            , scale: 1 // Scales overall size of the spinner
            , corners: 1 // Corner roundness (0..1)
            , color: '#000' // #rgb or #rrggbb or array of colors
            , opacity: 0.25 // Opacity of the lines
            , rotate: 0 // The rotation offset
            , direction: 1 // 1: clockwise, -1: counterclockwise
            , speed: 1 // Rounds per second
            , trail: 60 // Afterglow percentage
            , fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
            , zIndex: 2e9 // The z-index (defaults to 2000000000)
            , className: 'spinner' // The CSS class to assign to the spinner
            , top: '50%' // Top position relative to parent
            , left: '50%' // Left position relative to parent
            , shadow: true // Whether to render a shadow
            , hwaccel: true // Whether to use hardware acceleration
            , position: 'absolute' // Element positioning
        };
        var spinner = new Spinner(opts);

        function getfile(n) {
            return localStorage["baye//data//sango" + n + ".sav"];
        }

        function dump(n) {
            return getfile(n*2) + '.' + getfile(n*2+1);
        }

        function upload(n) {
            var self = $(this);
            spinner.spin(document.body);

            setTimeout(function(){
                var data = dump(n);

                $("#osize").html('origin:' + data.length);

                if (data.length < 100) {
                    $("#url-title").html("");
                    $("#url").html("该存档为空!");
                    spinner.stop();
                    return;
                }

                $("#result").html("请求中...");
                var result = LZMA.compress(data, 9);

                var b64data = Base64.encode(result);

                $("#zsize").html('result:' + result.length);
                $("#bsize").html('b64data:' + b64data.length);

                var libName = getLibName();
                var loadUrl = "http://bgwp.oschina.io/baye/load.html?sav=" + b64data + '&name=' + libName;

                function showLongUrl(url, n) {
                    $("#url-title").html("已生成存档" + (n + 1) + "的长网址:");
                    $("#url").html('<a href="' + url + '">' + "长按复制链接" + '</a>');
                }

                if ($("#use-short-url").val() != '1')
                {
                    spinner.stop();
                    showLongUrl(loadUrl, n);
                } else {
                    $.ajax({
                        url: "http://50r.cn/urls/add.jsonp?url=" + encodeURIComponent(loadUrl),
                        dataType: "jsonp",
                        jsonp: "callback",
                        jsonpCallback: "www_50r_cn_jsonp_callback",
                        type: "GET",
                        success: function(resp) {
                            spinner.stop();
                            $("#url-title").html("已生成存档" + (n + 1) + "的链接:");
                            $("#url").html('<a href="' + resp.url + '">' + resp.url + '</a>');
                        },
                        error: function() {
                            spinner.stop();
                            showLongUrl(loadUrl, n);
                        }
                    });
                }
            }, 10);
        }
    </script>
    <script>
        $(function(){
            var libName = getLibName();
            $("#lib-name").html("当前版本: " + libName);
        });
    </script>
</head>
<body>

    <button class="btn menu" type="button" onclick="upload(0)">导出存档1</button>
    <button class="btn menu" type="button" onclick="upload(1)">导出存档2</button>
    <button class="btn menu" type="button" onclick="upload(2)">导出存档3</button>

    <div >
        <div id="lib-name"></div>
        <div class="config-item">
            使用短网址:
            <select name="" id="use-short-url">
                <option value="0">否</option>
                <option value="1">是</option>
            </select>
        </div>
        <div id="url-title"></div>
        <div id="url"></div>
        <br>
        <div id="osize"></div>
        <div id="zsize"></div>
        <div id="bsize"></div>
    </div>

</body>
</html>
